<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
    <head>
        <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
        <title>Titulo</title>
        <style type="text/css">
            #contenido{
                position:absolute;
                left:248px;
                top:19px;
                padding:7px;
                width:400px;
            }
            #Direcciones{
                position:absolute;
                width: 639px;
                height: 166px;
                left: 24px;
                top: 106px;
            }
            #Botones{
                position:absolute;
                left: 671px;
                top: 105px;
                width: 293px;
                height: 179px;
            }
            #Botones2{
                position:absolute;
                left: 673px;
                top: 307px;
                width: 293px;
                height: 167px;
            }
            #Aceptar{
                position:absolute;
                left: 82px;
                top: 12px;
                width: 138px;
                height: 36px;
            }
            #btnEliminar{
                position:absolute;
                left: 82px;
                top: 63px;
                width: 138px;
                height: 32px;
            }
            #btnGuardar{
                position:absolute;
                left: 30px;
                top: 115px;
                height: 47px;
            }
            #btnRegistrar{
                position:absolute;
                left: 74px;
                top: 29px;
                width: 121px;
                height: 47px;
            }
            #btnCancelar{
                position:absolute;
                left: 74px;
                top: 97px;
                width: 121px;
                height: 47px;
            }
            #Panel_principal{
                position:absolute;
                width: 624px;
            }
        </style>
        <script src="SpryAssets/SpryTabbedPanels.js" type="text/javascript"></script>
        <link href="SpryAssets/SpryTabbedPanels.css" rel="stylesheet" type="text/css" />
    </head>
    <body>
        <div id="contenido">
            <form id="form8" name="form8" method="post" action="">
                <p>Usuario&nbsp;&nbsp;&nbsp;
                    <input type="text" name="txtusuario" id="txtusuario" />
                    &nbsp; Raza&nbsp; &nbsp;
                    <select name="lstRazas" id="lstRazas" onchange="javascript:recargar(this.value);">
                        <option value="R_001" selected="selected">Atlantis</option>
                        <option value="R_002">Asgard</option>
                        <option value="R_003">Ori</option>
                        <option value="R_004">Wraith</option>
                        <option value="R_005">Replicante</option>
                        <option value="R_006">Jaffa</option>
                        <option value="R_007">Tauri</option>
                        <option value="R_008">Goauld</option>
                    </select>
                    &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</p>
            </form>
        </div>
        <p>&nbsp;</p>
        <p>&nbsp;</p>
        <p>&nbsp;</p>
        <?php
        include 'conection.php';
        $link = Conectarse();
        session_start();
        ?>

        <div id="Direcciones">
            <script language="JavaScript" type="text/javascript" src="ajax.js"></script>
            <script>
                var arreglo_direcciones = new Array();
            </script>
            <p>Direcciones</p>
            <div id="Dir">
                
 <select id ="transporte" size="5" onchange="almacenar('Almacenar_UD.php?id='+this.value+'&array;='+arreglo_direcciones)">
                    <div id="Dir1">
                        Contenido
                    </div>
                </select>
            </div>
        </div>
        <script src="js/jquery-1.5.js" language="javascript"></script>
        <script language="javascript">
            function recargar(codigo_raza){
                /// Aqui podemos enviarle alguna variable a nuestro script PHP
                var variable_post=codigo_raza;
                /// Invocamos a nuestro script PHP
                $.post("Recargar_Paneles.php?id=tropas", { variable: variable_post }, function(data){
                    /// Ponemos la respuesta de nuestro script en el DIV recargado
                    $("#tropas").html(data);
                });
                $.post("Recargar_Paneles.php?id=naves", { variable: variable_post }, function(data){
                    /// Ponemos la respuesta de nuestro script en el DIV recargado
                    $("#naves").html(data);
                });
                $.post("Recargar_Paneles.php?id=defensas", { variable: variable_post }, function(data){
                    /// Ponemos la respuesta de nuestro script en el DIV recargado
                    $("#defensas").html(data);
                });
            }

        </script>

        <script >
            function ingresar()
            {
                var objeto=document.getElementById("transporte");
                var option=document.createElement("option");
                var MiVariable=prompt("Ingresa Direccion")
                option.text=MiVariable;
                try
                {
                    // for IE earlier than version 8
                    if(direccion_libre('Consultar_libre_dire.php?id='+MiVariable) || disponible(arreglo_direcciones,MiVariable))
                    {
                        objeto.add(option,objeto.options[null]);
                        arreglo_direcciones.push(MiVariable);//Agrega un elemento al array
                    }
                    
                }
                catch (e)
                {
                    objeto.add(option,null);
                }
            }
            function eliminar()
            {
                //alert($('#transporte option:selected').html());
                $('#transporte option:selected').remove();
            }
        </script>
        <p>&nbsp;</p>
        <p>&nbsp;</p>
        <p>&nbsp;</p>
        <p>&nbsp;</p>
        <p>&nbsp;</p>
        <div id="Botones">

            <p>
                <input type="submit" name="Aceptar" id="Aceptar" value="Agregar" onclick="ingresar()" />
            </p>
            <input type="button" name="btnEliminar" id="btnEliminar" value="Eliminar" onclick="eliminar()"/>
            <form id="form5" name="form5" method="post" action="">
                <input type="submit" name="btnGuardar" id="btnGuardar" value="GUARDAR DATOS DE ESTA DIRECCION" onclick="ACTUALIZA_VALORES_ED()"/>
            </form>
            <p>&nbsp;
            </p>
        </div>
        <p>&nbsp;</p>

        <div id="Panel_principal" class="TabbedPanels">
            <ul class="TabbedPanelsTabGroup">
                <li class="TabbedPanelsTab" tabindex="0">Tropas</li>
                <li class="TabbedPanelsTab" tabindex="0">Naves</li>
                <li class="TabbedPanelsTab" tabindex="0">Defensas</li>
            </ul>
            <div class="TabbedPanelsContentGroup">
                <div id ="tropas" class="TabbedPanelsContent">
                    <form id="form1" name="form1" method="post" action="">
                        <? echo $_SESSION['ultima_direccion']; ?>
                    </form>
                </div>
                <div id ="naves" class="TabbedPanelsContent">
                    <form id="form2" name="form2" method="post" action="">

                    </form>
                </div>
                <div id ="defensas" class="TabbedPanelsContent">
                    <form id="form3" name="form3" method="post" action="">

                    </form>
                </div>
            </div>
        </div>
        <script type="text/javascript">
            <!--
            var TabbedPanels1 = new Spry.Widget.TabbedPanels("Panel_principal");
            //-->
        </script>
        <div id="Botones2">
            <form id="form4" name="form4" method="post" action="">
                <input type="submit" name="btnRegistrar" id="btnRegistrar" value="Registrar" onclick ="registrar()"/>
            </form>

            <form id="form5" name="form5" method="post" action="">
                <input type="submit" name="btnCancelar" id="btnCancelar" value="Cancelar" onclick="Regresar()"/>
            </form></div>
    </body>
</html>
